<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改物料主数据')" />
    <th:block th:include="include :: datetimepicker-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-material-edit" th:object="${mdMaterial}">
            <input name="id" th:field="*{id}" type="hidden">
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">工厂代码：</label>
                <div class="col-sm-8">
                    <select name="plantCode" class="form-control m-b" th:with="type=${@dict.getType('plant')}" th:field="*{plantCode}" required>
                        <option value="">请选择工厂</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{plantCode}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">物料号：</label>
                <div class="col-sm-8">
                    <input name="materialCode" th:field="*{materialCode}" placeholder="请输入物料号" class="form-control" type="text" maxlength="20" required>
                    <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 必须以字母开头，长度6-20字符，只能包含字母数字和"-"</span>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">物料描述：</label>
                <div class="col-sm-8">
                    <input name="materialDesc" th:field="*{materialDesc}" placeholder="请输入物料描述" class="form-control" type="text" maxlength="100" required>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label is-required">物料类型：</label>
                <div class="col-sm-8">
                    <select name="materialType" class="form-control m-b" th:with="type=${@dict.getType('material_type')}" th:field="*{materialType}" required>
                        <option value="">请选择物料类型</option>
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{materialType}"></option>
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">库存量：</label>
                <div class="col-sm-8">
                    <input name="inStock" th:field="*{inStock}" placeholder="请输入库存量" class="form-control" type="number" step="0.01" min="0" readonly>
                    <span class="help-block m-b-none"><i class="fa fa-warning text-warning"></i> 编辑时库存量为只读，需通过库存管理模块修改</span>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">备注：</label>
                <div class="col-sm-8">
                    <textarea name="remark" th:field="*{remark}" class="form-control" placeholder="请输入备注" maxlength="500"></textarea>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: datetimepicker-js" />
    <script th:inline="javascript">
        var prefix = ctx + "system/material";
        var originalMaterialCode = [[${mdMaterial.materialCode}]];
        var originalPlantCode = [[${mdMaterial.plantCode}]];
        
        $("#form-material-edit").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                // 验证物料号格式
                var materialCode = $("input[name='materialCode']").val();
                if (!isValidMaterialCode(materialCode)) {
                    $.modal.alertWarning("物料号格式错误，必须以字母开头，长度6-20字符，只能包含字母数字和'-'");
                    return;
                }

                // 如果物料号或工厂代码有变化，需要验证唯一性
                var plantCode = $("select[name='plantCode']").val();
                if (materialCode !== originalMaterialCode || plantCode !== originalPlantCode) {
                    $.get(prefix + "/checkMaterialCodeUnique", {
                        plantCode: plantCode,
                        materialCode: materialCode,
                        id: $("input[name='id']").val()
                    }, function(result) {
                        if (result.data) {
                            $.operate.save(prefix, $('#form-material-edit').serialize());
                        } else {
                            $.modal.alertWarning("工厂内物料号已存在，请重新输入");
                        }
                    });
                } else {
                    $.operate.save(prefix, $('#form-material-edit').serialize());
                }
            }
        }

        function isValidMaterialCode(materialCode) {
            if (!materialCode) return false;
            var pattern = /^[A-Za-z][A-Za-z0-9\-]{5,19}$/;
            return pattern.test(materialCode);
        }

        // 物料号输入时实时验证格式
        $("input[name='materialCode']").on('input', function() {
            var materialCode = $(this).val();
            if (materialCode && !isValidMaterialCode(materialCode)) {
                $(this).addClass('is-invalid');
                $(this).next('.help-block').html('<i class="fa fa-warning text-danger"></i> 物料号格式错误，必须以字母开头，长度6-20字符，只能包含字母数字和"-"');
            } else {
                $(this).removeClass('is-invalid');
                $(this).next('.help-block').html('<i class="fa fa-info-circle"></i> 必须以字母开头，长度6-20字符，只能包含字母数字和"-"');
            }
        });
    </script>
</body>
</html> 